<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>样式绑定</title>
    <script type="text/javascript" src="vue.js"></script>
    <style>
      .activated {
        color: #0e7bbd;
      }

    </style>
</head>
<body>

      <div id="app">
          <div @click="handleDivClick" :class="[activated,activatedOne]">
            hello vue
          </div>
      </div>

      <script>
        var  vm =  new Vue({
          el:'#app',
          data:{
            activated:"",
            activatedOne:"activated-one"
          },
          methods:{
            handleDivClick:function () {

              this.activated = this.activated === "activated"? "" : "activated";
            }
          }
        })
      </script>
</body>
</html>